<%--
  Created by IntelliJ IDEA.
  User: xh
  Date: 2020/2/9
  Time: 15:56
  To change this template use File | Settings | File Templates.
--%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page isELIgnored="false"%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>随便说说 - 技术栈 -Java程序员成长平台</title>
    <meta name="keywords" content="">
    <meta name="description" content>
    <link rel="stylesheet" href="${APP_PATH}/vendor/layui-v2.4.5/layui/css/layui.css">
    <link rel="stylesheet" href="${APP_PATH}/css/common.css">
    <link rel="stylesheet" href="${APP_PATH}/css/header.css">
    <link rel="stylesheet" href="${APP_PATH}/css/footer.css">
    <link rel="stylesheet" href="${APP_PATH}/css/talk.css">
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body>
<jsp:include page="head.jsp"></jsp:include>

<div class="layui-main g-main">
    <div class="layui-row layui-col-space30">
        <div class="layui-col-xs9 l-talk">
            <div>
                <div class="header">今天想说点什么吗？</div>
                <div class="say-talk">
                    <textarea name="content" placeholder="写上一两句吧~" class="layui-textarea" autofocus></textarea>
                </div>
                <div class="layui-row say-talk-btn">
                    <a href="" class="layui-col-xs2"><i class="layui-icon c-mr3">&#xe60c;</i>插入表情</a>
                    <a href="" class="layui-col-xs2"><i class="layui-icon c-mr3">&#xe64a;</i>插入图片</a>
                    <div class="layui-col-xs3 layui-col-md-offset5 layui-row">
                        <span class="layui-col-xs4">0/150</span>
                        <button class="layui-col-xs8 layui-btn layui-btn-sm">发布说说</button>
                    </div>
                </div>
            </div>
            <div class="layui-row">
                <div class="layui-col-xs4 header what-talk">大家都在聊什么？</div>
            </div>
            <div class="now-talk">
                <c:forEach items="${requestScope.talks}" var="talk">
                <%--单个--%>
                <div class="item">
                    <div class="item-d">
                        <div class="m-head">
                            <a href="" class="m-head-img">
                                <img src="${APP_PATH}/img/photo.jpg">
                            </a>
                            <div class="info">
                                <a href="">${talk.talkInfo.user.username}</a>
                                <div>${talk.sendTime}</div>
                            </div>
                        </div>
                        <div class="content-val">
                            <div class="val">${talk.main}</div>
                            <div class="img"><img src="${APP_PATH}/img/talk_info_img.png" width="100%"></div>
                        </div>
                        <div class="content-btn">
                            <i class="layui-icon layui-icon-praise s-color-noclick" title="已赞">&nbsp;${talk.goodTotal}赞</i>
                            <a href="${APP_PATH}/talk/toTalk-detail?id=${talk.id}"><i class="layui-icon layui-icon-reply-fill">&nbsp;1评</i></a>
                            <i class="layui-icon layui-icon-read">&nbsp;1阅</i>
                        </div>
                    </div>
                </div>
                    <%--单个--%>
                </c:forEach>
            </div>
        </div>
        <div class="layui-col-xs3 l-hot-talk">
            <div class="l-talk">
                <div class="header">热门说说</div>
            </div>
            <c:forEach items="${requestScope.talks}" var="talk">
            <div class="item">
                <div class="item-d">
                    <div class="m-head">
                        <a  href="" class="m-head-img">
                            <img src="${APP_PATH}/img/photo.jpg">
                        </a>
                        <div class="info">
                            <a href="">${talk.talkInfo.user.username}</a>
                            <div>${talk.sendTime}</div>
                        </div>
                    </div>
                    <div class="content-val">
                        <div class="val">${talk.main}</div>
                        <div class="img"><img src="${APP_PATH}/img/talk_info_img.png" width="100%"></div>
                    </div>
                    <div class="content-btn">
                        <i class="layui-icon layui-icon-praise s-color-noclick" title="已赞">&nbsp;${talk.goodTotal}赞</i>
                        <a href="${APP_PATH}/talk/toTalk-detail?id=${talk.id}"><i class="layui-icon layui-icon-reply-fill">&nbsp;1评</i></a>
                        <i class="layui-icon layui-icon-read">&nbsp;1阅</i>
                    </div>
                </div>
            </div>
            </c:forEach>
        </div>
    </div>
</div>

<div class="g-footer">
    <hr>
    <div>Copyright ©2018 技术栈(jishuzhan.club), All Rights Reserved.</div>
    <div>渝ICP备13001123号-2</div>
</div>

<script src="${APP_PATH}/vendor/holder.min.js"></script>
<script src="${APP_PATH}/vendor/layui-v2.4.5/layui/layui.js"></script>
<script src="${APP_PATH}/js/common.js"></script>
<script src="${APP_PATH}/js/talk.js"></script>
</body>
</html>
